<!DOCTYPE html>
<html xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout" layout:decorate="~{layout}">

<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"/>

    <title th:text="#{screen.surrogates.account.selection.header}">Surrogate Account Selection View</title>
    <link href="../../static/css/cas.css" rel="stylesheet" th:remove="tag" />
</head>

<body>
<main role="main" class="container mt-3 mb-3">
    <div layout:fragment="content">
        <div class="alert alert-info">
            <form method="post" id="loginForm" class="fm-v clearfix">
                <div class="form-group">
                    <h2 th:text="#{screen.surrogates.choose.account}">Choose Account</h2>
                    <div th:utext="#{screen.surrogates.message}">
                        <p>You are provided with a list of accounts on behalf of which you are allowed to authenticate. </p>
                        <p>Select one and continue.</p>
                    </div>
                    <label for="surrogateTarget" class="fl-label">Account:</label>
                    <select name="surrogateTarget" id="surrogateTarget" class="form-control">
                        <option th:each="surrogate: ${surrogates}" th:value="${surrogate}" th:text="${surrogate}"/>
                    </select>


                </div>
                <input type="hidden" name="execution" th:value="${flowExecutionKey}"/>
                <input type="hidden" name="_eventId" value="submit"/>
                <input class="btn btn-submit" name="submit" accesskey="l"
                       th:value="#{screen.welcome.button.login}" type="submit" value="Login"/>
                
                &nbsp;<a class="btn btn-danger" id="cancel" name="cancel"
                         th:unless="${service}"
                         th:href="@{/login}" th:text="#{screen.surrogates.button.cancel}">Cancel</a>
                &nbsp;<a class="btn btn-primary" id="login" name="login"
                         th:if="${service}"
                         th:href="${service.id}" th:text="#{screen.error.page.loginagain}">Login</a>

            </form>
        </div>
    </div>
</body>
</html>
